<template>
  <div>
    <el-dialog
      title="班主任列表"
      :close-on-click-modal="false"
      :visible.sync="teacherVisible"
      class="JADP-dialog JADP-dialog_center"
      lock-scroll
      width="70%"
      v-loading="loading"
      append-to-body
    >
      <div class="JADP-common-layout-center">
        <el-row class="JADP-common-search-box" :gutter="16">
          <el-form @submit.native.prevent>
            <el-col :span="6">
              <el-form-item label="姓名">
                <el-input v-model="query.name" placeholder="请输入" clearable>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  @click="search()"
                  >查询</el-button
                >
                <el-button icon="el-icon-refresh-right" @click="reset()"
                  >重置</el-button
                >
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
        <div class="JADP-common-layout-main JADP-flex-main">
          <JADP-table
            v-loading="listLoading"
            :data="list"
            @sort-change="sortChange"
            highlight-current-row
            @current-change="handleSelectionChange"
          >
            <el-table-column prop="name" label="姓名" align="left" />
            <el-table-column prop="sex" label="性别" align="left" />
            <el-table-column prop="company" label="工作单位" align="left" />
            <el-table-column prop="job" label="职务" align="left" />
            <el-table-column prop="tel" label="手机号" align="left" />
            <!-- <el-table-column
              prop="creatortime"
              label="创建时间"
              align="left"
              sortable="custom"
            /> -->
          </JADP-table>
          <pagination
            :total="total"
            :page.sync="listQuery.currentPage"
            :limit.sync="listQuery.pageSize"
            @pagination="initData"
          />
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="teacherVisible = false">取 消</el-button>
        <el-button type="primary" @click="determine">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import request from "@/utils/request";
export default {
  name: "headmaster",
  data() {
    return {
      teacherVisible: false,
      loading: false,
      listLoading: false,
      list: [],
      multipleSelection: [],
      total: 0,
      query: {
        realname: undefined,
        technicaltitle: undefined,
        teachingsubjects: undefined,
        worktype: undefined,
        certificatesnumber: undefined,
        major: undefined,
        skilllevel: undefined
      },
      listQuery: {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "creatortime"
      }
    };
  },
  created() {
    this.initData();
  },
  methods: {
    //查询
    search() {
      this.listQuery = {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "creatortime"
      };
      this.initData();
    },
    //重置
    reset() {
      for (let key in this.query) {
        this.query[key] = undefined;
      }
      this.search();
    },
    // 确定
    determine() {
      this.$emit("determine", this.multipleSelection);
      this.teacherVisible = false;
    },
    handleSelectionChange(val) {
      //   const res = val.map(item => item.id);
      this.multipleSelection = val;
    },
    sortChange({ column, prop, order }) {
      this.listQuery.sort = order == "ascending" ? "asc" : "desc";
      this.listQuery.sidx = !order ? "" : prop;
      this.initData();
    },
    initData() {
      this.listLoading = true;
      let _query = {
        ...this.listQuery,
        ...this.query,
        organizeId:this.$store.getters.organizeId

      };
      request({
        url: `/api/headTeacher/Xy_ks_head_teacher`,
        method: "get",
        data: _query
      }).then(res => {
        this.list = res.data.list;
        this.total = res.data.pagination.total;
        this.listLoading = false;
      });
    }
  }
};
</script>
<style scoped lang="scss"></style>
